// 获取当前时间
var time = new Date()
// console.log(time*1)
// 五个btn
var dateArr = [1, 0, -1, -2, -3]
// 现在页面中btn的value值 并设置title属性值
dateArr.forEach(function (i, index) {
    var now = new Date(time - i * 24 * 60 * 60 * 1000)
    var h = now.getFullYear()
    var m = now.getMonth() + 1
    var d = now.getDate()
    // 获取当前的星期
    var w = now.getDay()
    // 获取当前时间的年月日
    var nowDate = h + '-' + m + '-' + d
    //    console.log(nowDate)
    var num = index + 1
    $('#btn' + num + ' ').attr('title', nowDate)
    //    console.log(w)

    // 判断按钮是否显示今天 否则显示当前时间的星期
    if (num != 2) {
        let btnWeek = isWeek(w)
        $(('#btn' + num + ' ')).val(btnWeek)

    }
    else {
        showH4(nowDate)

    }

})

// 当前时间
var btnDate = $('#btn2').attr('title')
// console.log(btnDate)


// 日期
$('#data').datepicker({
    altField: "#hide",
    dateFormat: 'yy-m-d',

})

// 内容改变的时候
function choose() {
    // console.log($('#data').val())
    var h4Data = $('#data').val()
    btnDate = h4Data
    refresh()
    showH4(h4Data)
    // $('#showData').text(h4Data)
    $('#data').val('选择日期')

}
// 点击星期按钮时刷新页面
function handle(e) {
    // console.log(e.target)
    var tag = $(e.target)
    btnDate = tag.attr('title')
    // console.log(btnDate)
    showH4(btnDate)
    // $('#showData').text(btnDate)
    refresh()
}
// 按钮
$("#btn").buttonset();

var arr;
// 判断浏览器存储是否有content字段
var findStr = localStorage.getItem('content')
// console.log(findStr)
if (findStr) {
    arr = JSON.parse(findStr)
}
else {
    arr = []
}


// 提交
$('#content').click(function () {
    var dataObj = {}
    var str = $('#text').val().trim()
    // 判断输入框是否为空
    if (str == '') {
        // console.log('--')
    }

    else {
        dataObj.time = btnDate
        dataObj.data = str
        dataObj.id = new Date() * 1
        arr.push(dataObj)
        console.log(arr)
        // 浏览器本地存储
        localStorage.setItem('content', JSON.stringify(arr))

    }
    $('#text').val('')
    // 刷新页面
    refresh()

})

// 模板渲染
function refresh() {
        var obj = {
            data: arr,
            btntime: btnDate
        }
    // console.dir(obj)
    var htmlStr = template('show1', obj)
    $('#box').html(htmlStr)

}

// 刷新页面
refresh()

// 排序
$("#box").sortable({
    // 排序结束时
    stop: function () {
        idArr = idOrder("#box")
        // console.log(idArr)
        // 将数组中当前时间的信息全部删除 然后按照排序后的顺序在合并数组，然后再写入本地存储
        for(var i=0;i<arr.length;i++){
            if(btnDate==arr[i].time){
                // 删除当前时间的全部信息
                arr.splice(i,1)
                i=i-1
            }
        }
        // console.dir(arr)
        // 数组重新合并
        arr=arr.concat(idArr)
        // console.dir(arr)
        // 在写入本地存储
         localStorage.setItem('content', JSON.stringify(arr))
        //  刷新页面
        refresh()
    }
});
$("#box").disableSelection();

// 显示在标题的日期
function showH4(data) {
    let week = new Date(data).getDay()
    // console.log(week)
    let nowWeek = isWeek(week)
    // console.log(nowWeek)
    $('#showData').text(data + ' ' + nowWeek)
}

// 判断星期
function isWeek(w) {

    switch (w) {
        case 0:
            w = '周日'
            break
        case 1:
            w = '周一'
            break
        case 2:
            w = '周二'
            break
        case 3:
            w = '周三'
            break
        case 4:
            w = '周四'
            break
        case 5:
            w = '周五'
            break
        case 6:
            w = '周六'
            break

    }
    return w
}

// 获取排序后的数组信息
function idOrder(e) {
    let idArr = [];
    let tag = $(e).children()
    tag.each(function (index, item) {
        if (btnDate == $(item).attr('data')) {
             let obj = {}
            obj.time = $(item).attr('data')
            obj.id = $(item).attr('id')
            obj.data = $(item).text().trim()
            idArr.push(obj)
        }
    })
    return idArr
}